<template>
  <div class="Root">
    <van-nav-bar title="标题" />
    <div>
      <van-form @submit="onSubmit">
        <van-field
          v-model="user.mobile"
          name="mobile"
          label="手机号"
          placeholder="手机号"
          required
          :rules="[{ required: true, message: '请填写手机号',pattern:/^1[3456789]\d{9}$/ }]"
        />
        <van-field
          v-model="user.code"
          type="password"
          name="code"
          label="密码"
          placeholder="密码"
          required
          :rules="[{ required: true, message: '请填写密码',pattern:/^\d{6}$/ }]"
        />
        <div style="margin: 16px">
          <van-button round block type="info" native-type="submit" :disabled="isLodaing" :loading="isLodaing" loading-text="正在登陆"
            >登录</van-button
          >
        </div>
      </van-form>
    </div>
  </div>
</template>

<script>
import {loginAPI} from '@/api/index'
import {Notify} from 'vant'
import {setToken} from '@/utils/token'
export default {
  name: "Login",
  components: {},
  props: {},
  data() {
    return {
     user:{
       mobile: "17630520584",//手机号
      code: "246810",//验证码246810
     },
     isLodaing:false
    };
  },
  watch: {},
  computed: {},
  methods: {
    async onSubmit(values) {
      this.isLodaing = true
      try {
        let res = await loginAPI(this.user)
   
      Notify({type:"success",message:"登陆成功"})
      setToken(res.data.data.token)
      localStorage.setItem('refresh_token',res.data.data.refresh_token)
      this.isLodaing = false
      this.$router.replace({name:'layout',path:'/layout'})
      }catch(error){
        Notify({type:"danger",message:"账号或者密码错误"})
        this.isLodaing = false
      }
    },
    
  },
  created() {},
  mounted() {},
};
</script>
<style lang="less" scoped>
.van-nav-bar {
  background-color: rgb(0, 115, 255);
}
</style>